<template>
	<view class="bann-container">
		<swiper  :indicator-dots="true" :autoplay="true" :interval="5000"
				:duration="3000" :circular="true">
			<swiper-item v-for="item in bannerData" :key="item._id">
				<image :src="item.imagePath" ></image>
			</swiper-item>
		</swiper>
	</view>

</template>

<script setup>
import { onMounted, ref } from 'vue';

	const bannerData = ref([]);
		
		onMounted(()=>{
			getBanners();
		})
		
		function getBanners(){
			uni.request({
				url:"http://nocat.life:3017/banners/query",
				 data: {
				        show: '1'
				    },
					method:"POST"
			}).then((res)=>{
				if(res.data.code == 200){
					bannerData.value = res.data.data.rows;
				}
			})
		}
</script>

<style scoped lang="scss">
.bann-container{
	swiper{
		width: 686rpx;
		height: 354rpx;
	};
	image{
		width: 100%;
		height: 304rpx;
	}
}
</style>